<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title>12</title>
        <style>
            textarea{
                width: 100%;
                height: 150px;
                padding: 12px 20px;
                box-sizing: border-box;
                border: 2px solid #ccc;
                border-radius: 4px;
                background-color: #f8f8f8;
                font-size: 16px;
                resize: none;
            }
            select{
                width: 100%;
                padding: 16px 20px;
                border: none;
                border-radius: 4px;
                background-color: #f1f1f1;
            }
            label{
                color: red;
                padding: 20px 20px;

            }
            input[type=button],input[type=reset],input[type=submit]{
                background-color: #4caf50;
                border: none;
                color: white;
                padding: 16px 32px;
                text-decoration: none;
                margin: 4px 2px;
                cursor: pointer;
            }
        </style>
    </head>
    <body>
        <p><strong>提示:</strong>使用 resize 属性来禁用文本框可以重置大小的功能（一般拖动右下脚可以重置大小）</p>
        <form action="/">
            <textarea name="" id="">文本框</textarea>
            <label for="country">国家:</label>
            <select name="country" id="country">
                <option value="cn">china</option>
                <option value="us">american</option>
                <option value="uk">england</option>
            </select>
            <label for="buttons">按钮样式:</label>
            <input type="button" value="按钮">
            <input type="reset" value="重置">
            <input type="submit" value="提交">

        </form>



    </body>
</html>